import { createSlice } from "@reduxjs/toolkit";
import { useSelector } from "react-redux";
import { getFirstCategory, getSecondCategory, getThirdCategory } from "@/api/sph";

// 分类
export interface CategoryModel {
    id: number;
    name: string;

    // 页面显示需要
    hasChildren?: boolean; // 标识是否有子分类
    level?: number; // 标识是第几级分类
}

// 分类列表
export type CategoryListModel = CategoryModel[];

// number和undefined 类型别名
export type Numberable = number | undefined;

// 三个级别分类id => 用于约束请求接口的条件参数
export interface CategoryIdsModel {
    category1Id: Numberable;
    category2Id: Numberable;
    category3Id: Numberable;
}

// 创建auth切片
const categorySlice = createSlice({
    name: "category",
    initialState: {
        categoryList1: [] as CategoryListModel, // 一级分类列表
        categoryList2: [] as CategoryListModel, // 二级分类列表
        categoryList3: [] as CategoryListModel, // 三级分类列表
        category1Id: undefined, // 一级分类id
        category2Id: undefined, // 二级分类id
        category3Id: undefined, // 三级分类id
    },
    reducers: {
        // 更新一级分类列表
        upCategoryList1(state: any, { payload }: any) {
            state.categoryList1 = payload;
        },
        // 更新二级分类列表
        upCategoryList2(state: any, { payload }: any) {
            state.categoryList2 = payload;
        },
        // 更新三级分类列表
        upCategoryList3(state: any, { payload }: any) {
            state.categoryList3 = payload;
        },
        // 更新一级分类id
        upCategory1Id(state: any, { payload }: any) {
            state.category1Id = payload;
        },
        // 更新二级分类id
        upCategory2Id(state: any, { payload }: any) {
            state.category2Id = payload;
        },
        // 更新三级分类id
        upCategory3Id(state: any, { payload }: any) {
            state.category3Id = payload;
        },
    },
});

// 异步获取一级分类列表
const { upCategoryList1 } = categorySlice.actions;
export const getCategoryList1Async = function () {
    return async (dispatch: any) => {
        const result = await getFirstCategory();
        dispatch(upCategoryList1(result.data));
    };
};
// 异步获取二级分类列表
const { upCategoryList2 } = categorySlice.actions;
export const getCategoryList2Async = function (category1Id: Numberable) {
    return async (dispatch: any) => {
        // 清空二级和三级分类列表
        dispatch(upCategoryList2([]));
        dispatch(upCategory2Id(undefined));
        dispatch(upCategoryList3([]));
        dispatch(upCategory3Id(undefined));
        const result = await getSecondCategory(category1Id);
        dispatch(upCategoryList2(result.data));
    };
};
// 异步获取三级分类列表
const { upCategoryList3 } = categorySlice.actions;
export const getCategoryList3Async = function (category2Id: Numberable) {
    return async (dispatch: any) => {
        // 清空三级分类
        dispatch(upCategoryList3([]));
        dispatch(upCategory3Id(undefined));
        const result = await getThirdCategory(category2Id);
        dispatch(upCategoryList3(result.data));
    };
};

export const { upCategory1Id, upCategory2Id, upCategory3Id } = categorySlice.actions;

// 暴露获取状态的方法
export const useSelectorCategory = () => useSelector((state: any) => state.category);

// 暴露auth切片
export default categorySlice.reducer;
